<template>
	<u-navbar back-icon-color="#fff" :border-bottom="false">
		<view class="switch">
			<text :class="[!actived && 'active']" @click="updateVal(0)">{{ tabName[0] }}</text>
			<text :class="[actived && 'active']" @click="updateVal(1)">{{ tabName[1] }}</text>
		</view>
	</u-navbar>
</template>

<script>
export default {
	props: {
		tabName: {
			type: Array,
			required: true
		},
		activeTab: {
			type: Number,
			required: true
		}
	},
	watch: {
		activeTab: {
			immediate: true,
			handler(n) {
				this.actived = n;
			}
		}
	},
	data() {
		return {
			actived: 0
		};
	},
	methods: {
		updateVal(val) {
			this.$emit('update:activeTab', val);
		}
	}
};
</script>

<style scoped lang="scss">
</style>
